﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="c.aspx.cs" Inherits="BaseWeb.Test.c" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <script src="../Script/jquery.js" type="text/javascript"></script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h1>
            模块拖拽</h1>
        <style type="text/css">
            .drag
            {
                position: absolute;
                width: 100px;
                height: 100px;
                border: 1px solid #ddd;
                background: #FBF2BD;
                padding: 5px;
                top: 100px;
                left: 20px;
                cursor: move;
            }
        </style>
        <div class="drag">
            wwww</div>

        <script type="text/javascript">
            $(function()
            {
                var move = false;
                var mdx, mdy;
                $(".drag").mousedown(function(e)
                {
                    move = true;
                    mdx = e.pageX - parseInt($(".drag").css("left"));
                    mdy = e.pageY - parseInt($(".drag").css("top"));
                    //mdx = e.pageX - $(this).offset().left;
                    //mdy = e.pageY - $(this).offset().top; $(this).fadeTo("slow", 0.8);
                });

                $(document).mousemove(function(e)
                {
                    if (move)
                    {
                        _x = e.pageX - mdx;
                        _y = e.pageY - mdy;
                        $(".drag").css({ left: _x, top: _y });
                    }
                }).mouseup(function()
                {
                    move = false;
                    // $(".drag").fadeTo("fast", 1);
                });
            }); 
            
        </script>

    </div>
    </form>
</body>
</html>
